 
 
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <title th:text="${question.title+@environment.getProperty('site.main.titleInfo')}"></title>
  <th:block th:insert="~{common/header :: head}"></th:block>
  <!--script src="/js/community.js" type="application/javascript"></script-->
  <script src="/js/moment.js" type="application/javascript"></script>
  <script src="/js/clipboard.js" type="application/javascript"></script>
  <!--link href="http://cdn.bootcss.com/highlight.js/8.0/styles/monokai_sublime.min.css" rel="stylesheet">
  <script src="http://cdn.bootcss.com/highlight.js/8.0/highlight.min.js"></script-->
</head>
<body>

<div th:insert="~{common/header :: nav}"></div>

<div th:insert="~{common/header :: sub_nav}" class="html5plus-hide"></div>

<div class="layui-container">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md8 content detail">
      <div class="fly-panel detail-box">
        <h1 th:text="${question.title}"></h1>
        <div class="fly-detail-info">
          <!-- <span class="layui-badge">审核中</span> -->
          <a class="layui-badge layui-bg-green" th:if="${question.column2==1}">提问</a>
          <a class="layui-badge layui-bg-green" th:if="${question.column2==2}">分享</a>
          <a class="layui-badge layui-bg-green" th:if="${question.column2==3}">建议</a>
          <a class="layui-badge layui-bg-green" th:if="${question.column2==4}">讨论</a>
          <a class="layui-badge layui-bg-green" th:if="${question.column2==5}">公告</a>
          <a class="layui-badge layui-bg-green" th:if="${question.column2==6}">动态</a>
          <a class="layui-badge layui-bg-green" th:if="${question.column2==9}">其它</a>
          <span class="layui-badge" style="background-color: #999;">未结</span>
          <!-- <span class="layui-badge" style="background-color: #5FB878;">已结</span> -->
          
          <span th:if="${question.sticky}" class="layui-badge layui-bg-orange">置顶</span>
          <span th:if="${question.essence}" class="layui-badge layui-bg-red">精帖</span>
          
          <div class="fly-admin-box" th:data-id="${question.id}" th:if="${session.user!=null}">
            <span th:if="${question.canDelete}" class="layui-btn layui-btn-xs jie-admin" type="del">删除</span>
            
            <span th:if="${question.canSticky&&(!question.sticky)}" class="layui-btn layui-btn-xs jie-admin" type="set" field="stick" rank="1">置顶</span>
            <span th:if="${question.sticky&&question.canSticky}" class="layui-btn layui-btn-xs jie-admin" type="set" field="stick" rank="0" style="background-color:#ccc;">取消置顶</span>
            
            <span th:if="${question.canEssence&&(!question.essence)}" class="layui-btn layui-btn-xs jie-admin" type="set" field="essence" rank="1">加精</span>
            <span th:if="${question.canEssence&&(question.essence)}" class="layui-btn layui-btn-xs jie-admin" type="set" field="essence" rank="0" style="background-color:#ccc;">取消加精</span>
            <span th:if="${question.canPromote}" class="layui-btn layui-btn-xs jie-admin" type="set" field="promote" rank="1">提升</span>
            <span th:if="${question.canClassify}" class="layui-btn layui-btn-xs jie-admin" id="admin-btn">快改</span>
          </div>
          <span class="fly-list-nums"> 
            <a href="#comment"><i class="iconfont" title="回复">&#xe60c;</i><span th:text="${question.commentCount}"></span></a>
            <i class="iconfont" title="浏览">&#xe60b;</i><span th:text="${question.viewCount}"></span>
          </span>
        </div>
        <div class="detail-about">
          <a class="fly-avatar niter-avatar" th:href="${'/user/'+question.user.id}">
            <img th:src="${question.user.avatarUrl}"
                 th:alt="${question.user.name}">
          </a>
          <div class="fly-detail-user">
            <a th:href="${'/user/'+question.user.id}" class="fly-link" target="_blank">
              <i th:if="${question.userAccount.vipRank==1}" class="layui-icon fly-list-kiss" title="红砖会员等级：LV1">&#xe735</i>
              <cite th:class="${question.userAccount.vipRank==1? 'fly-list-kiss':''}" th:text="${question.user.name}"></cite>
              <i class="layui-badge fly-badge-vip layui-bg-gray" th:text="${@environment.getProperty('user.group.r'+question.userAccount.groupId)}"></i>
            </a>
            <span th:text="${'于 '+#dates.format(question.gmtModified,'yyyy-MM-dd HH:mm')}"></span><th:block th:text="${question.edited?' 编辑':' 发表'}"></th:block>
          </div>
          <div class="detail-hits" id="LAY_jieAdmin" data-id="123">
            <span style="padding-right: 10px; color: #FF7200" >点击群号免费加入尼特社区交流群：<a target="_blank" th:href="${@environment.getProperty('site.info.contactQunUrl')}" th:text="${@environment.getProperty('site.info.contactQun')}"></a>。</span>
            <span th:if="${session.user!=null&&question.canEdit}" class="layui-btn layui-btn-xs jie-admin" type="edit"><a th:href="@{'/p/publish/'+${question.id}}" style="margin-left: -5px;"><i class="layui-icon">&#xe642;</i>编辑</a></span>
            <!--span th:data-id="${question.id}" onclick="like_question(this)" class="layui-btn layui-btn-xs layui-btn-warm"><i class="layui-icon">&#xe600;</i><th:block th:text="${question.favorite?'已':''}"></th:block>收藏(<span th:id="${'questionlikecount-'+question.id}" th:text="${question.likeCount}"></span>)</span-->
          </div>
        </div>
        <div style="margin-top: 5px;margin-bottom: -15px;text-align: center" class="html5plus-hide layui-hide-sm">
          <a class="layui-btn layui-btn-radius layui-btn-primary layui-btn-fluid" href="javascript:downloadApp()" style="color: red">打开或者下载<i class="layui-icon">&#xe63b;</i>APP，畅享极致体验</a>
        </div>
        <div style="margin-top: 20px;margin-bottom: 20px" class="layui-text layui-table video photos p-detail" id="descriptionP" th:text="${question.description}">
        </div>
        <div style="text-align: center;margin-top: 10px">
          <span th:data-id="${question.id}" onclick="like_question(this)" style="font-size: 15px; color: #FFB800;cursor: pointer"><i class="layui-icon" th:text="${question.favorite?'&#xe658;':'&#xe600;'}">&#xe600; &#xe658;</i><th:block th:text="${question.favorite?'已':''}"></th:block>收藏(<span th:id="${'questionlikecount-'+question.id}" th:text="${question.likeCount}"></span>)</span>
          <span class="copyshare"><i class="layui-icon" style="font-size: 15px; color: #1E9FFF;cursor: pointer">&#xe641; 分享</i></span>
        </div><!--分享-->
        <div style="margin-top: 10px">
          相关标签：
          <span class="layui-badge-rim" th:each="tag : ${question.tag.split(',')}">
                        <a th:href="@{/(page=1,tag=${tag})}"
                           th:text="${tag}" class="community-tag"></a>
          </span>
        </div><!--标签-->

      </div>

      <div class="fly-panel detail-box" id="flyReply">
        <fieldset class="layui-elem-field layui-field-title" style="text-align: center;">
          <legend th:text="${question.commentCount+'个回复'}"></legend>

        </fieldset>

        <ul class="jieda" id="jieda" th:each="comment : ${comments}">
          <li th:data-id="${comment.id}" th:id="${'comment-body-'+comment.id}" class="jieda-daan">
            <a name="item-1111111111"></a>
            <div class="detail-about detail-about-reply">
              <a class="fly-avatar niter-avatar" th:href="${'/user/'+comment.user.id}">
                <img th:src="${comment.user.avatarUrl}"
                     th:alt="${comment.user.name}">
              </a>
              <div class="fly-detail-user">
                <a th:href="${'/user/'+comment.user.id}" class="fly-link" target="_blank">
                  <i th:if="${comment.userAccount.vipRank==1}" class="layui-icon fly-list-kiss" title="红砖会员等级：LV1">&#xe735</i>
                  <cite th:class="${comment.userAccount.vipRank==1? 'fly-list-kiss':''}" th:text="${comment.user.name}"></cite>
                  <i class="layui-badge fly-badge-vip layui-bg-gray" th:text="${@environment.getProperty('user.group.r'+comment.userAccount.groupId)}"></i>
                </a>
                <span th:if="${question.user.id == comment.user.id}">(楼主)</span>
                <!--
                <span style="color:#5FB878">(管理员)</span>
                <span style="color:#FF9E3F">（社区之光）</span>
                <span style="color:#999">（该号已被封）</span>
                -->
              </div>

              <div class="detail-hits">
                <span th:text="${#dates.format(comment.gmtCreate,'yyyy-MM-dd  HH:mm')}"></span>
              </div>

              <!--i class="iconfont icon-caina" title="该贴已被管理员推荐"></i-->
            </div>
            <div class="detail-body jieda-body photos" th:text="${comment.content}">
            </div>
            <div class="jieda-reply">
              <span class="jieda-zan"  th:id="${'thumbicon-'+comment.id}">
                <i class="iconfont icon-zan" th:data-id="${comment.id}" onclick="like_comment(this)"></i>
                <em th:id="${'likecount-'+comment.id}" th:text="${comment.likeCount}" th:class="${comment.likeCount != 0}? 'zanok' : ''"></em>
              </span>
              <span th:data-id="${comment.id}" onclick="collapseComments(this)">
                <i class="iconfont icon-svgmoban53"></i>
               <em th:text="${comment.commentCount}" th:class="${comment.commentCount != 0}? 'zanok' : ''"></em>
              </span>
              <div class="jieda-admin" th:if="${session.user!=null&&session.userAccount!=null}">
                <span type="edit" th:if="${comment.commentator==session.user.id}">编辑</span>
                <span type="del" th:if="${session.userAccount.groupId>18||comment.commentator==session.user.id}">删除</span>
                <span class="jieda-accept" type="accept" th:if="${session.userAccount.groupId>18}">采纳</span>
              </div>
            </div>
            <!--二级评论-->
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 layui-colla-content sub-comments"
                 th:id="${'comment-'+comment.id}" lay-filter="sub-comments">
              <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <input type="text" class="form-control layui-input" placeholder=""
                       th:id="${'input-'+comment.id}">
                <button th:id="${'btn-'+comment.id}" type="button" class="layui-btn  rightbtn" onclick="comment(this)"
                        th:data-id="${comment.id}" data-type= 2 >评论
                </button>
              </div>
            </div>
          </li>

        </ul>
        <!-- 无数据时 -->
        <ul class="jieda">
        <li th:if="${question.commentCount==0}" class="fly-none">消灭零回复</li>
        </ul>
        
        <div class="layui-form layui-form-pane">
          <!--form action="/jie/reply/" method="post"-->
          <input type="hidden" id="question_id" th:value="${question.id}">
            <div class="layui-form-item layui-form-text">
              <a name="comment"></a>
              <div class="layui-input-block">
                <textarea id="comment_content" name="content" required lay-verify="required" placeholder="请输入内容"  class="layui-textarea fly-editor" style="height: 150px;"></textarea>
              </div>
            </div>
            <div class="layui-form-item">
              <input type="hidden" name="jid" value="123">
              <button class="layui-btn" lay-filter="*"  onclick="commentQ()">回复</button>
            </div>
          <div id="commentQBtn" style="width: 100px;height: 36px;">
            <div class="vaptcha-init-main">
              <div class="vaptcha-init-loading">
                <a href="/" target="_blank">
                  <img src="https://r.vaptcha.com/public/img/vaptcha-loading.gif" />
                </a>
                <span class="vaptcha-text">Vaptcha启动中...</span>
              </div>
            </div>
          </div>
          <!--/form-->
        </div>
      </div>

        <form class="layui-form" id="admin-panel" style="display:none">
        <input style="display: none" name="id" th:value="${question.id}">
        <div class="layui-form-item" >
            <label class="layui-form-label" style="padding: 9px 0px;text-align: center">所在专栏</label>
            <div class="layui-input-block" style="margin-left: 80px">
                <select lay-verify="required" id="column2" name="column2"  >
                    <option></option>
                    <option value="1" th:selected="${question.column2==1}">提问</option>
                    <option value="2" th:selected="${question.column2==2}" >分享</option>
                    <option value="3" th:selected="${question.column2==3}">建议</option>
                    <option value="4" th:selected="${question.column2==4}">讨论</option>
                    <option th:if="${question.canSticky}" th:selected="${question.column2==5}" value="5">公告</option>
                    <option value="6" th:selected="${question.column2==6}">动态</option>
                    <option value="9" th:selected="${question.column2==9}">其它</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label" style="padding: 9px 0px;text-align: center">阅读权限</label>
                    <div class="layui-input-block" style="margin-left: 80px;">
                        <select lay-verify="required" id="permission" name="permission">
                            <option value="0" th:selected="${question.permission==0}">默认，所有用户可见</option>
                            <option value="1" th:selected="${question.permission==1}">LV1及以上用户可见</option>
                            <option value="2" th:selected="${question.permission==2}">LV2及以上用户可见</option>
                            <option value="3" th:selected="${question.permission==3}">LV3及以上用户可见</option>
                            <option value="4" th:selected="${question.permission==4}">LV4及以上用户可见</option>
                            <option value="5" th:selected="${question.permission==5}">LV5及以上用户可见</option>
                            <option value="6" th:selected="${question.permission==6}">LV6及以上用户可见</option>
                            <option value="10" th:selected="${question.permission==10}">会员专享</option>
                            <option value="19" th:selected="${question.permission==19}">管理员可见</option>
                        </select>
                    </div>
                </div>
         </div>
        <div class="layui-form-item">
            <button style="float: right" class="layui-btn" lay-filter="submitAdmin" lay-submit>确认修改</button>
        </div>
        </form>
    </div>
    <th:block th:insert="~{common/sider :: p_detail}"></th:block>
  </div>
  </div>

<script type="text/javascript">
  var obj = document.getElementById("descriptionP");
  //alert(obj.innerText);//这样就自动解析了
  obj.innerHTML = obj.innerText;//这样重新设置html代码为解析后的格式
</script>

<th:block th:insert="~{common/footer :: foot}"></th:block>

<script>
layui.cache.page = 'jie';
layui.cache.user = {
  username: '匿名用户'
  ,uid: -1
  ,avatar: '/images/avatar/00.jpg'
  ,experience: 83
  ,sex: '男'
};
layui.config({
  version: "3.0.0"
  ,base: '/mods/'
}).extend({
  fly: 'index'
}).use(['fly', 'face'], function(){
  var $ = layui.$
  ,fly = layui.fly;
  //如果你是采用模版自带的编辑器，你需要开启以下语句来解析。

  $('.detail-body').each(function(){
    var othis = $(this), html = othis.html();
    othis.html(fly.content(html));
  });



});
</script>
<script>
  layui.use(['element', 'layer'/*,'code'*/], function(){
    var element = layui.element;
    var layer = layui.layer;
   /*layui.code({
      elem: 'pre', //默认值为.layui-code
      height:500,
      about: false,
    }); //引用code方法
*/

    //监听折叠
    element.on('collapse(sub-comments)', function(data){
      layer.msg('展开状态：'+ data.show);
    });
  });
</script>
<script src="https://v.vaptcha.com/v3.js"></script>
<script type="text/javascript">
  //addHtml5Plus();
  var con = '我在尼特社区找到一篇好文章《'+document.title+'》，快来戳后面的链接来围观吧！---'+this.location.href;
  function myPlusShare() {
    window.plusShare({
      title: "尼特社区",//应用名字
      content: con,
      href: location.href,//分享出去后，点击跳转地址
      thumbs: ["http://m.example.com/imgs/1.png"] //分享缩略图
    }, function(result) {
      //分享回调
    });  }
  var clipboard = new ClipboardJS('.copyshare', {
    text: function() {
      //     var con = '我在凯文社区找到一篇好文章《'+document.title+'》，快来围观吧！---'+this.location.href;
      //alert("进来了"+document.title+this.location.href);
      //alert(con);
      if(navigator.userAgent.indexOf("Html5Plus") > -1) {
        //5+ 原生分享
           myPlusShare();
      } else {
        //原有wap分享实现
        swal("复制成功!", "赶快去粘贴分享文章吧~", "success");
      }
      //swal("复制成功!", "赶快去分享文章吧~", "success");
      return ''+con;
    }
  });

  clipboard.on('success', function(e) {
    console.log(e);
  });

  clipboard.on('error', function(e) {
    console.log(e);
  });
</script>
<script type="text/javascript">
  token = '';
  userIp='';
  function commentQ() {
    if(token == '') {
      swal({
        title: "哎哟...",
        text: "请先完成人机验证再提交哦~",
        icon: "error",
        button: "确认",
      });
    }else{
      post();
    }
  }

  vaptcha({
    //配置参数
    vid: '[[${vaptcha_vid}]]', // 验证单元id
    type: 'click', // 展现类型 点击式
    container: '#commentQBtn', // 按钮容器，可为Element 或者 selector
    scene:2,               //场景值02，即评论
    offline_server: '/validateOffline' //离线模式服务端地址
  }).then(function (vaptchaObj) {
    //  obj2=vaptchaObj;
    //vaptchaObj.render()// 调用验证实例 vpObj 的 render 方法加载验证按钮
    vaptchaObj.listen('pass', function() {
      // 验证成功， 进行登录操作
      // console.log(vaptchaObj.getToken());
      //getCode();
      $.ajax({
        type: "get",
        url: "/getIp",
        ContentType: "application/json",
        CacheControl: "no-cache",
        //  dataType: "json",
        success: function(data) {
         // userIp=data;
          $.ajax({
            type: "post",
            url: "/validate",
            ContentType: "application/json",
            CacheControl: "no-cache",
            data:{
              scene:2,
              token:vaptchaObj.getToken(),
              ip:data
            },
            //  dataType: "json",
            success: function(data) {
              if(data.success==1){
                //成功
                token = vaptchaObj.getToken();
                //console.log(token);
              }
              else if(data.success==0){
                swal({
                  title: ""+data.msg,
                  text: "您未能通过我们的第二次智能检测，请稍后再试或联系管理员",
                  icon: "error",
                  button: "确认",
                });
                //vaptchaObj.reset();
              }
            },
            error: function(msg) {
              console.log(msg)
            }
          })
        },
        error: function(msg) {
          console.log(msg)
        }})



    })
    vaptchaObj.listen('close', function() {
      //验证弹窗关闭触发
      swal({
        title: "哎哟...",
        text: "您关闭了验证哦",
        icon: "error",
        button: "确认",
      });
    })
    vaptchaObj.render()// 调用验证实例 vaptchaObj 的 render 方法加载验证按钮
  })
</script>
</body>
</html>